import 'package:flutter/animation.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

void main() {
  runApp(const MaterialApp(home: HomePage()));
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage>
    with SingleTickerProviderStateMixin {
  late AnimationController _controlier;
  @override
  void initState() {
    super.initState();
    _controlier = AnimationController(
      vsync: this, // 程序和设备刷新率统一
      duration: const Duration(seconds: 1),
    );
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('你好flutter1'),
        ),
        body: Column(
          children: [
            // TODO icon之间的过渡 close_menu 从close过渡到menu
            AnimatedIcon(
              icon: AnimatedIcons.close_menu,
              progress: _controlier,
              size: 40,
            ),
            AnimatedIcon(
              icon: AnimatedIcons.home_menu,
              progress: _controlier,
              size: 40,
            ),
            AnimatedIcon(
              icon: AnimatedIcons.list_view,
              progress: _controlier,
              size: 40,
            ),
            // 自定义交错动画
            Stack(
              children: [
                // 0-0.5缩小
                ScaleTransition(
                  scale: _controlier.drive(Tween(begin: 1.0, end: 0.0)
                      .chain(CurveTween(curve: Interval(0.0, 0.5)))),
                  child: Icon(Icons.close, size: 40),
                ),
                // 0.5-1.0-放大
                ScaleTransition(
                  scale: _controlier.drive(Tween(begin: 0.0, end: 1.0)
                      .chain(CurveTween(curve: Interval(0.5, 1.0)))),
                  child: Icon(Icons.search, size: 40),
                ),
              ],
            ),
            Column(
              children: [
                SlidingBox(
                  controlier: _controlier,
                  color: Colors.blue[100],
                  curve: Interval(0.0, 0.2),
                ),
                SlidingBox(
                  controlier: _controlier,
                  color: Colors.blue[200],
                  curve: Interval(0.2, 0.4),
                ),
                SlidingBox(
                  controlier: _controlier,
                  color: Colors.blue[400],
                  curve: Interval(0.4, 0.6),
                ),
              ],
            ),
            Wrap(
              spacing: 10,
              runSpacing: 5,
              alignment: WrapAlignment.spaceAround,
              children: [
                ElevatedButton(
                  onPressed: () {
                    _controlier.repeat(reverse: true);
                  },
                  child: Text('无限执行'),
                ),
                ElevatedButton(
                  onPressed: () {
                    _controlier.stop();
                  },
                  child: Text('停止'),
                ),
                ElevatedButton(
                  onPressed: () {
                    _controlier.forward();
                  },
                  child: Text('执行一次'),
                ),
                ElevatedButton(
                  onPressed: () {
                    _controlier.reverse();
                  },
                  child: Text('反向执行一次'),
                ),
                ElevatedButton(
                  onPressed: () {
                    _controlier.reset();
                  },
                  child: Text('重置'),
                ),
              ],
            )
          ],
        ),
      ),
    );
  }
}


// 封装动画盒子
class SlidingBox extends StatefulWidget {
  final AnimationController controlier;// 动画控制器
  final Color? color; // 因为下面color就是这种类型，所以必须这样定义
  final Curve curve; // 动画时间区间
  SlidingBox({
    super.key,
    required this.controlier,
    required this.color,
    required this.curve,
  });

  @override
  State<SlidingBox> createState() => _SlidingBoxState();
}

class _SlidingBoxState extends State<SlidingBox> {
  @override
  Widget build(BuildContext context) {
    return SlideTransition(
      position: widget.controlier.drive(
        Tween(begin: Offset(0, 0), end: Offset(1, 0))
            .chain(CurveTween(curve: widget.curve)),
      ),
      child: Container(
        height: 100,
        width: 200,
        color: widget.color,
      ),
    );
  }
}
